jQuery OrgFinder v1.0.0

jQuery Plugn Macros

Configuration

Name Type Description
initLatLng Array<Number> Initialized latitude and longitude of map
initZoomLevel Number Initialized zoom level of map
initQuery String Initialized search query
googleAPIKey String Google API key
searchUrl String Search URL. Must be link to signup page of a group or /organisations/ (if you use this plugin in Kademi admin console)
template String Template string for orgFinder. Form search must has 'org-finder-search' class and textbox must be named 'q'. Items list wrapper must has 'org-finder-list' class. Map div must has class 'org-finder-map'
onReady Function Callback will be called when orgFinder is ready. Arguments: 'formSearch', 'itemsWrapper', 'mapDiv'
onSelect Function Callback will be called when click on marker on map or item in org list panel. Arguments: 'orgData', 'item', 'marker', 'infoWindow'
onSearch Function Callback will be called when when search a keyword. Arguments: 'query'
renderItemContent Function Method for rendering content of an item in organization list. If you don't want to show this organization, just return null or empty. Arguments: 'orgData'
renderMarkerContent Function Method for rendering content for InfoWindow of a marker on Google Map. If you don't want to show this organization, just return null or empty. Arguments: 'orgData'

 

Default Configuration

{
    initLatLng: [],
    initZoomLevel: 15,
    initQuery: null,
    googleAPIKey: null,
    searchUrl: null,
    template:
    '<form role="form" class="form-horizontal form-search org-finder-search" action="" style="margin-bottom: 15px;">' +
    '    <div class="input-group input-group-lg">' +
    '        <input type="text" name="q" class="form-control" placeholder="Enter keyword to search..." value="" />' +
    '        <span class="input-group-btn">' +
    '            <button class="btn btn-default" type="submit">Search</button>' +
    '        </span>' +
    '    </div>' +
    '</form>' +
    '<div class="row" style="margin-bottom: 40px;">' +
    '    <div class="col-md-4">' +
    '        <div class="panel panel-default">' +
    '            <div class="panel-heading">List stores</div>' +
    '            <div class="list-group org-finder-list" style="overflow-y: auto;"></div>' +
    '        </div>' +
    '    </div>' +
    '    <div class="col-md-8">' +
    '        <div class="embed-responsive embed-responsive-16by9">' +
    '            <div class="embed-responsive-item org-finder-map"></div>' +
    '        </div>' +
    '    </div>' +
    '</div>'
    ,
    onReady: function (formSearch, itemsWrapper, mapDiv) {
    },
    onSelect: function (orgData, item, marker, infoWindow) {
    },
    onSearch: function (query) {
    },
    renderItemContent: function (orgData) {
        var itemContent = '';
        itemContent += '<h4 class="list-group-item-heading">' + (orgData.orgTypeDisplayName || orgData.title ) + '</h4>';

        if (orgData.phone) {
            itemContent += '<p class="list-group-item-text"><strong>Phone:</strong> ' + orgData.phone + '</p>';
        }
        if (orgData.email) {
            itemContent += '<p class=list-group-item-text"><strong>Email:</strong> <a href="mailto:' + orgData.email + '">' + orgData.email + '</a></p>';
        }
        if (orgData.address) {
            itemContent += '<p class="list-group-item-text"><strong>Address:</strong> ' + orgData.address + '</p>';
        }
        if (orgData.addressLine2) {
            itemContent += '<p class=list-group-item-text"><strong>Address Line 2:</strong> ' + orgData.addressLine2 + '</p>';
        }
        if (orgData.addressState) {
            itemContent += '<p class="list-group-item-text"><strong>State:</strong> ' + orgData.addressState + '</p>';
        }
        if (orgData.country) {
            itemContent += '<p class="list-group-item-text"><strong>Country:</strong> ' + orgData.country + '</p>';
        }
        if (orgData.postcode) {
            itemContent += '<p class="list-group-item-text"><strong>Postcode:</strong> ' + orgData.postcode + '</p>';
        }

        return '<div class="list-group-item">' + itemContent + '</div>';
    },
    renderMarkerContent: function (orgData) {
        var markerContent = '';
        markerContent += '<h1>' + (orgData.orgTypeDisplayName || orgData.title ) + '</h1>';

        if (orgData.phone) {
            markerContent += '<div><strong>Phone:</strong> ' + orgData.phone + '</div>';
        }
        if (orgData.email) {
            markerContent += '<div><strong>Email:</strong> <a href="mailto:' + orgData.email + '">' + orgData.email + '</a></div>';
        }
        if (orgData.address) {
            markerContent += '<div><strong>Address:</strong> ' + orgData.address + '</div>';
        }
        if (orgData.addressLine2) {
            markerContent += '<div><strong>Address Line 2:</strong> ' + orgData.addressLine2 + '</div>';
        }
        if (orgData.addressState) {
            markerContent += '<div><strong>State:</strong> ' + orgData.addressState + '</div>';
        }
        if (orgData.country) {
            markerContent += '<div><strong>Country:</strong> ' + orgData.country + '</div>';
        }
        if (orgData.postcode) {
            markerContent += '<div><strong>Postcode:</strong> ' + orgData.postcode + '</div>';
        }

        return '<div>' + markerContent + '</div>';
    }
}

 

Versions Back to main page... 1.0.1 (Source code) 1.0.0 (Source code)
Hide comments